import React, { Component } from 'react'
import '../assets/styles/home/home-news.less'

import { hashHistory } from 'react-router'

import { List } from 'antd-mobile';
import axios from 'axios';

const Item = List.Item;
const Brief = Item.Brief;

export default class HomeNews extends Component {
    state = {
        arr: []
    }
    componentDidMount() {
        axios.get('/data/newsList.json').then(res => {
            let { data } = res
            this.setState({
                arr: data
            })
        })
    }
    itemClick(id) {
        // 手动地把 页面跳转到detail， 带上一个id
        // console.log(id);
        hashHistory.push('/detail/' + id)
    }
    render() {
        return (
            <div className="home-news">
                <h3 className="new-header">相关资讯</h3>
                <List className="my-list">
                    {
                        this.state.arr.map((item, index) => {
                            return <Item
                                arrow="horizontal"
                                thumb={item.img}
                                multipleLine
                                onClick={this.itemClick.bind(this, 100)}
                            >
                                {item.title} <Brief>{item.desc}</Brief>
                            </Item>
                        })
                    }

                </List>
            </div>
        )
    }
}
